import { ref, onMounted, watch } from 'vue'

const getListApi = (uid: number): any => { // 定义函数参数类型和返回值类型
  return new Promise((resolve) => {
    // event loop
    setTimeout(() => {
      const list: Array<number> = [1, 2, 3, 4, 5, 6, 9, 12, 15]
      resolve(list)
      console.log('更改uid > 获取新list: ', uid, list)
    }, 200)

    // 立即执行
    // const list: Array<number> = [1, 2, 3, 4, 5, 6, 9, 12, 15]
    // resolve(list)
    // console.log('uid > list: ', uid, list)
  })
}
export default function helloWorldList(user: any) {
  const list = ref([])
  const getList = async () => {
    list.value = await getListApi(user.value as number)
  }

  // 生命周期钩子函数执行时 
  onMounted(() => {
    console.log('onMounted')
    getList()
  })

  // 监听props的msg属性【参数】变化
  watch(user, getList)

  return {
    list,
    getList
  }
}